<template lang="pug">
  .basicAttr
    Form(ref='basicAttrForm',:model='formValidate',:rules='ruleValidate',:label-width="150")
      Row
        Col(span="9")
          FormItem(label='任务周期类型：')
            Select(v-model="formValidate.taskPeriodType")
              Option(v-for='(taskType,index) in taskCycleTypes',:value="taskType.itemType",:key="taskType.value") {{taskType.itemName}}
        Col(span="9")
          FormItem(label="编码：")
            Select(v-model="formValidate.charSet")
              Option(v-for="(codingScheme,index) in codingSchemes",:value="codingScheme.value",:key="index") {{codingScheme.label}}
      Row
        Col(span="9")
          FormItem(label="页面请求方式：")
            Select(v-model="formValidate.requestType")
              Option(v-for="(requestMethod,index) in requestMethods",:value="requestMethod.itemType",:key="index") {{requestMethod.itemName}}
        Col(span="9")
          aside(style='display:inline-block')
            label(style='width:150px').ivu-form-item-label 需要URL去重：
            Checkbox(v-model="formValidate.deduplicate",:true-value='1',:false-value='0',style='vertical-align:sub')
          aside(v-if='formValidate.taskPeriodType === 2',style='display:inline-block')
            label(style='width:155px').ivu-form-item-label 需要URL周期性去重：
            Checkbox(v-model="formValidate.periodicDeduplicate",:true-value='1',:false-value='0',style='vertical-align:-webkit-baseline-middle')
      Row
        Col(span="9")
          FormItem(label="URL去重保留时长：")
            Select(v-model="formValidate.maxDeduplicateTime")
              Option(v-for='(duration,index) in durations',:value='duration.value',:key='index') {{duration.label}}
        Col(span="9")
          FormItem(label="连接超时时间：")
            Select(v-model="formValidate.connectionTimeout")
              Option(v-for='(connection,index) in connections',:value='connection.value',:key='index') {{connection.label}}
      Row
        Col(span="9")
          FormItem(label="最大重试次数：")
            Select(v-model="formValidate.maxRetryCount")
              Option(v-for="(num,index) in maximums",:value="num.value",:key="index") {{num.label}}
        Col(span="9")
          FormItem(label="代理IP：")
            Select(v-model="formValidate.proxyId")
              Option(v-for='(agency,index) in agencyData',:value='agency.value',:key='index') {{agency.label}}
      Row
        Col(span="9")
          FormItem(label="优先级：")
            Select(v-model="formValidate.priority")
              Option(v-for="priority in prioritys",:value="priority.itemType",:key="priority.itemName") {{priority.itemName}}
        Col(span="9")
          FormItem(label="采集时间间隔：")
            Select(v-model="formValidate.crawlTimeInterval")
              Option(v-for="interval in intervals",:value="interval.value",:key="interval.label") {{interval.label}}
      Row
        Col(span="9")
          FormItem(label="采集开始时间：",required)
            DatePicker(type="datetime",:value='$dayjs(formValidate.startTime).format("YYYY-MM-DD HH:mm:ss")',placeholder="采集开始时间",@on-change='handleStartTime',@on-open-change="handleSetDateReadonly")
        Col(span="9")
          FormItem(label="采集结束时间：",required)
            DatePicker(type="datetime",:value='$dayjs(formValidate.endTime).format("YYYY-MM-DD HH:mm:ss")',placeholder="采集结束时间",@on-change='handleEndTime',@on-open-change="handleSetDateReadonly")
      FormItem(label="用户代理：",prop='userAgent')
        Input(v-model="formValidate.userAgent",:maxlength="500",placeholder="User Agent",style='width:670px')
      FormItem(label="referer：",prop='referer')
        Input(v-model="formValidate.referer",:maxlength="500",placeholder="referer",style='width:670px')
      FormItem(label='采集类型：')
        Col(span='6')
          RadioGroup(v-model="formValidate.taskType")
            Radio(:label='0') 普通
            Radio(:label='1') 在线
            Radio(:label='2') 特殊
</template>

<script>
import asyncGather from '../../api'
import { codingSchemes, durations, connections, maximums, agencyData, intervals } from '../data'

export default {
  data() {
    return {
      codingSchemes,
      durations,
      connections,
      maximums,
      agencyData,
      intervals,
      taskCycleTypes: [],
      requestMethods: [],
      prioritys: [],
      formValidate: {
        taskPeriodType: '',
        charSet: 'utf-8',
        requestType: '',
        deduplicate: 0,
        periodicDeduplicate: 0,
        maxDeduplicateTime: 86400000,
        connectionTimeout: 30000,
        maxRetryCount: 1,
        proxyId: 0,
        priority: '',
        crawlTimeInterval: 300000,
        taskType: 0,
        userAgent: '',
        startTime: '',
        endTime: '',
        referer: ''
      },
      ruleValidate: {
        userAgent: [{ message: '请输入用户代理,并填写正确User Agent格式', trigger: 'blur' }],
        referer: [{ message: '请输入referer', trigger: 'blur' }, { type: 'url', message: '格式错误，非正确referer格式', trigger: 'blur' }]
      }
    }
  },
  created() {
    ;(async () => {
      const [taskCycleTypes, prioritys, requestMethods] = await Promise.all([
        asyncGather.queryType({ data: { typeId: 5 } }),
        asyncGather.queryType({ data: { typeId: 6 } }),
        asyncGather.queryType({ data: { typeId: 7 } })
      ]).catch(error => {})
      this.taskCycleTypes = taskCycleTypes.data.data
      this.prioritys = prioritys.data.data
      this.requestMethods = requestMethods.data.data
      if (this.$route.query.status === 'add') {
        this.formValidate.taskPeriodType = taskCycleTypes.data.data[0].itemType
        this.formValidate.priority = prioritys.data.data[0].itemType
        this.formValidate.requestType = requestMethods.data.data[0].itemType
      }
    })()
  },
  methods: {
    handleSetDateReadonly() {
      document.querySelectorAll('.ivu-input')[1].setAttribute('readonly', true)
      document.querySelectorAll('.ivu-input')[2].setAttribute('readonly', true)
    },
    handleStartTime(val) {
      if (val !== '') this.formValidate.startTime = +this.$dayjs(val)
    },
    handleEndTime(val) {
      if (val !== '') this.formValidate.endTime = +this.$dayjs(val)
    }
  }
}
</script>
